<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<link
	href="https://cdn.bootcss.com/twitter-bootstrap/3.3.7/css/bootstrap.css"
	rel="stylesheet">
<link href="../css/user.css" type="text/css" rel="stylesheet">
<!-- <link
	href="../static/BS/2.1.1bootstrap.css"
	rel="stylesheet">
<link href="../static/css/user.css" type="text/css" rel="stylesheet"> -->

<body id="body-all">
	<!--页面导航栏-->
	<nav class="navbar navbar-default navbar-fixed-top">
		<div class="container-fluid">
			<div class="navbar-items">
				<div class="col-lg-2 col-md-2">
					<a class="navbar-brand" href="#"> <img alt="程续缘LOGO"
						src="../img/logo-user.png">
					</a>
				</div>
				<div class="navbar-pages">
					<span class="page"><a href="#">首页</a></span> <span class="page"><a
						href="#">搜索</a></span> <span class="page"><a href="#">掏心会员</a></span>
				</div>
				<div class="navbar-right">
					<div class="icon user-icon">
						<div class="dropdown">
							<button class="btn btn-default dropdown-toggle" type="button"
								id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true"
								aria-expanded="true"
								style="background: transparent; border: none">
								<img src="../img/user-user.png">
							</button>
							<ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
								<li><a href="#">个人主页</a></li>
								<li><a href="#">编辑资料</a></li>
								<li><a href="#">修改密码</a></li>
								<li role="separator" class="divider" style="padding: 1px"></li>
								<li><a href="#">退出</a></li>
							</ul>
						</div>
					</div>

					<div class="icon mail-icon">
						<div class="dropdown">
							<button class="btn btn-default dropdown-toggle" type="button"
								id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true"
								aria-expanded="true"
								style="background: transparent; border: none">
								<img src="../img/mail-user.png">
							</button>
							<ul class="dropdown-menu" aria-labelledby="dropdownMenu2">
								<li><a href="#">消息 <span class="badge dropdown-badge">99</span></a></li>
								<li><a href="#">系统消息</a></li>
								<li role="separator" class="divider" style="padding: 0px"></li>
								<li><a href="#">谁看过我</a></li>
							</ul>
						</div>
						<span class="badge icon-badge">99</span>
					</div>
				</div>
			</div>
		</div>
	</nav>


	<!-- <div class="pos-fixed">
            <ul class="ul-li">
                <li title="在线资源" class="kef">在线资源</li>
                <li title="手机网" class="Net">手机网</li>
                <li title="收藏本站" class="collect">收藏本站</li>
                <li title="意见反馈" class="advice">意见反馈</li>
                <li title="返回顶部" class="top">返回顶部</li>
            </ul>
        </div> -->
	<div class="container" id="head-top">
		<div class="head-m">
			<div class="h1">
				<div class="row" id="info-head">
					<div class="col-md-4" id="img-head">
						<img src="../img/head-user.jpg" alt="人物头像" class="size-img">
					</div>
					<div class="col-md-8" id="text-head">
						<span id="text-head-span">个人昵称：北菲</span> <span id="id-text-head">ID：123456</span>
						<span value="会缘" class="FLAG-user"><a href="#"><img
								src="../img/member-user.png" alt="会员" class="b-img"></a></span> <span
							value="实名" class="FLAG-name"><a href="#"><img
								src="../img/infoSure-user.png" alt="实名" class="b-img"></a></span>
					</div>
				</div>
				<div>
					<input type="button" class="btn btn-info btn-lg" value="关注"
						id="btn-focus" onclick="change()">
				</div>

			</div>
		</div>
		<!-- 图片 -->
		<div class="text-danger">
			<div class="page header" style="text-align: center; font-size: 25px;">全面真实照片</div>
			<div class="panel-group" id="accordion">
				<div class="panel panel-default  bg-info">
					<div class="panel-heading">
						<h3 class="panel-title">
							<a data-toggle="collapse" data-parent="#accordion"
								href="#collapseOne" class="a-body"> 点击可看：游玩随拍 </a>
						</h3>
					</div>
					<div id="collapseOne" class="panel-collapse collapse in">
						<div class="panel-body">
							<img src="../img/travel-user.png" alt="休闲游玩" class="size-img">
						</div>
					</div>
				</div>
				<div class="panel panel-default  bg-success">
					<div class="panel-heading">
						<h3 class="panel-title">
							<a data-toggle="collapse" data-parent="#accordion"
								href="#collapseTwo" class="a-body"> 点击可看：工作随拍： </a>
						</h3>
					</div>
					<div id="collapseTwo" class="panel-collapse collapse">
						<div class="panel-body">
							<img src="../img/work-user.jpg" alt="辛勤工作" class="size-img">
						</div>
					</div>
				</div>
				<div class="panel panel-default  bg-danger">
					<div class="panel-heading">
						<h3 class="panel-title">
							<a data-toggle="collapse" data-parent="#accordion"
								href="#collapseThree" class="a-body"> 点击可看：生活随拍 </a>
						</h3>
					</div>
					<div id="collapseThree" class="panel-collapse collapse">
						<div class="panel-body">
							<img src="../img/life-user.jpg" alt="安静生活" class="size-img">
						</div>
					</div>
				</div>
			</div>
		</div>

		<div class="body-m">
			<div class="bg-info">
				<div class="row container">
					<button type="button" class="btn btn-primary btn-lg col-md-6">发消息
					</button>
					<!-- <div class="col-md-6" id="send-message"><a href="">发消息</a></div>| -->
					<!-- <div class="col-md-6" id="link-two"><a href="">红娘牵线</a></div> -->
					<button type="button" class="btn btn-primary btn-lg  col-md-6"
						data-toggle="modal" data-target="#myModal">红娘牵线</button>

					<!-- Modal -->
					<div class="modal fade" id="myModal" tabindex="-1" role="dialog"
						aria-labelledby="myModalLabel">
						<div class="modal-dialog" role="document">
							<div class="modal-content">
								<div class="modal-header bg-info">
									<button type="button" class="close" data-dismiss="modal"
										aria-label="Close">
										<span aria-hidden="true">&times;</span>
									</button>
									<h4 class="modal-title" id="myModalLabel"
										style="text-align: center">委托红娘</h4>
								</div>
								<div class="modal-body bg-info">如有需求请拨打红娘热线：131-6462-7219</div>
								<div class="modal-footer bg-info">
									<button type="button" class="btn btn-default"
										data-dismiss="modal">关闭</button>
									<button type="button" class="btn btn-primary">已了解</button>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			<div id="self-body-intro" class="bg-left">
				<h3>&nbsp;内心独白：</h3>
				<span class="span-heart"> 皮囊还行，灵魂更有趣。性格直率，爱浪漫，也爱平淡生活中的烟火气儿~
					这一生太难，想被你哄着过完。 看到很多人要求自然美，自然还得美那种。 那我希望能找到有眼缘的，和长得不好看的不投缘。
					也别问我择偶条件重要还是眼缘重要，没有眼缘我根本不会去看你的条件。
					对于要一起走一辈子的人，不能将就，我怕半路大家就走散了。爱情我要，面包我也不能缺。 彼此尊重，系统发送的消息不回复。 </span>
			</div>

			<div class="bg-left" id="self-message">
				<h3>&nbsp;个人资料：</h3>
				<!-- <div class="row" id="info-body-you">
                    <span class="col-md-11"><h3>&nbsp;个人介绍：</h3></span>
                    <span class="col-md-3">&nbsp;年龄:&nbsp;&nbsp;23</span>
                    <span class="col-md-3">学历:&nbsp;&nbsp;硕士</span>
                    <span class="col-md-3">薪资:&nbsp;&nbsp;10000-19999￥</span>
                    <span class="col-md-3">婚否:&nbsp;&nbsp;未婚</span>
                    <span class="col-md-3">&nbsp;吸烟:&nbsp;&nbsp;不吸烟</span>
                    <span class="col-md-3">喝酒:&nbsp;&nbsp;喝点啤酒</span>
                    <span class="col-md-3">身高:&nbsp;&nbsp;163cm</span>
                    <span class="col-md-7">&nbsp;地址:&nbsp;&nbsp;珠海市前山区</span>
                </div> -->
				<div class="purple-btns">
					<div class="m-btn-purple">未婚</div>
					<div class="m-btn-purple">26岁</div>
					<div class="m-btn-purple">双子座</div>
					<div class="m-btn-purple">165cm</div>
					<div class="m-btn-purple">59kg</div>
					<div class="m-btn-purple">工作地:珠海市前山区</div>
					<div class="m-btn-purple">月收入:10K-13K</div>
					<div class="m-btn-purple">项目经理</div>
					<div class="m-btn-purple">本科</div>
				</div>

				<div class="pink-btns">
					<div class="m-btn-pink">籍贯:广东珠海</div>
					<div class="m-btn-pink">体型:丰满</div>
					<div class="m-btn-pink">不吸烟</div>
					<div class="m-btn-pink">不喝酒</div>
					<div class="m-btn-pink">自己租的房子</div>
					<div class="m-btn-pink">没有小孩</div>
					<div class="m-btn-pink">打算什么时候结婚:一年之内</div>
					<div class="m-btn-pink">是否想要孩子:想要孩子</div>
				</div>

			</div>
			<div class="bg-left-self" id="self-like">
				<h3>个人喜好：</h3>
				<!-- <span>喜欢唱歌，自我感觉良好；<br>喜欢下厨，虽然菜做的一般；<br>喜欢去周边游玩；</span> -->
				<div class="text-index row">
					<div class="item-f col-md-6">
						<div class="question f-1">最喜欢的书:</div>
						<div class="answer f-1">傲慢与偏见</div>
					</div>
					<div class="item-f col-md-6">
						<div class="question f-1">最喜欢的菜:</div>
						<div class="answer f-1">未填写</div>
					</div>
					<div class="item-f col-md-6">
						<div class="question f-1">最欣赏的人:</div>
						<div class="answer f-1">未填写</div>
					</div>
					<div class="item-f col-md-6">
						<div class="question f-1">最喜欢的歌:</div>
						<div class="answer f-1">未填写</div>
					</div>
					<div class="item-f col-md-6">
						<div class="question f-1">喜欢做的事:</div>
						<div class="answer f-1">未填写</div>
					</div>
				</div>
			</div>
			<div class="bg-left">
				<h3>&nbsp;择偶标准：</h3>
				<!-- <span>&nbsp;年龄区间：18-36岁</span>&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;
                <span>&nbsp;居住地：长期生活在珠海</span>&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;
                <span>&nbsp;薪资要求：工资不能比我低</span> -->
				<div>
					<div class="ask-standard">
						<div class="t-btn">22-36岁</div>
						<div class="t-btn">工作地:广东珠海</div>
						<div class="t-btn">月薪:1.5W-3W</div>
						<div class="t-btn">大学本科</div>
						<div class="t-btn">未婚</div>
						<div class="t-btn">没有小孩</div>
						<div class="t-btn">成熟稳重不失浪漫</div>
					</div>
				</div>
			</div>
			<div class="bg-left">
				<h3>&nbsp;她的动态：</h3>
				<p style="font-size: 16px">
					该用户还发布了 <span>10条</span> 动态分享它的生活 <br> 扫描了解更多
				</p>
				<span> <img src="../img/QRcode-user.png" alt="二维码，让你更了解他/她"
					class="size-img">
				</span>

			</div>
		</div>
		<div class="foot-m"></div>
	</div>

</body>
<script type="text/javascript">
    function change() {
      if (document.getElementById("btn-focus").value == '关注') {
        document.getElementById("btn-focus").value = '已关注'
      } else {
        document.getElementById("btn-focus").value = '关注'
      }
    }


</script>
<!-- <script src="../static/BS/2.1.1jquery.min.js"
	type="text/javascript"></script>
<script
	src="../static/BS/3.3.7bootstrap.js"
	type="text/javascript"></script>
<script src="../static/BS/2.9.6holder.min.js"></script> -->
<script src="https://cdn.bootcss.com/jquery/2.1.1/jquery.min.js"
	type="text/javascript"></script>
<script
	src="https://cdn.bootcss.com/twitter-bootstrap/3.3.7/js/bootstrap.js"
	type="text/javascript"></script>
<script src="https://cdn.bootcss.com/holder/2.9.6/holder.min.js"></script>

</html>